<template>
  <div>
    <el-dialog
      v-model="state.centerDialogVisible"
      title="上报实施成果"
      width="50%"
      align-center
      @open="openHandler"
      @close="handleClose"
      class="dialogStyle"
    >
      <el-form
        :model="formInline"
        :rules="rules"
        ref="formRef"
        class="demo-form-inline"
        label-width="120px"
      >
        <el-form-item label="所属项目集">
          <el-input disabled v-model="formInline.projectSetName" placeholder="" />
        </el-form-item>
        <el-form-item label="项目集编号">
          <el-input disabled v-model="formInline.projectSetId" placeholder="" />
        </el-form-item>
        <el-form-item label="计划时间范围">
          <el-date-picker
            :disabled="state.type!==2 && state.isDark!=='1'"
            v-model="formInline.planTime"
            type="daterange"
            range-separator="-"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            value-format="YYYY-MM-DD"
          />
        </el-form-item>
        <el-form-item label="所属项目">
          <el-input disabled v-model="formInline.projectName" placeholder="" />
        </el-form-item>
        <el-form-item label="项目编号">
          <el-input disabled v-model="formInline.projectId" placeholder="" />
        </el-form-item>

        <el-form-item label="是否关注项目">
          <el-radio-group v-model="formInline.interestStatus" disabled>
            <el-radio :label="1">是</el-radio>
            <el-radio :label="-1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="所属阶段">
          <el-input
            disabled
            v-model="formInline.projectStageName"
            placeholder=""
          />
        </el-form-item>
        <el-form-item label="处理部门">
          <el-input
            disabled
            v-model="formInline.responsibleDepartmentName"
            placeholder=""
          />
        </el-form-item>
        <el-form-item label="所属任务">
          <el-input disabled v-model="formInline.taskName" placeholder="" />
        </el-form-item>
        <el-form-item label="任务编码">
          <el-input disabled v-model="formInline.projectTaskId" placeholder="" />
        </el-form-item>
        <el-form-item label="处理人">
          <el-input
            disabled
            v-model="formInline.responsibleUserName"
            placeholder=""
          />
        </el-form-item>
        <p class="oneline" style="font-size: 12px; color: #ccc;">形象进度汇报</p>
        <el-form-item label="进度文档" class="oneline" prop="files">
          <!-- //pic为了验证图片是必传的 -->
          <FileMinioUpload
            :disabled="state.type"
            :businessType="21"
            :associationId="formInline.projectTaskId"
            :restriction="true"
            :restrictionLimit="9"
            v-model:files="formInline.files"
            :show-button="!state.type"
          />
        </el-form-item>
        <el-form-item label="实际完成时间">
          <el-date-picker
            :disabled="state.isDark!=='1'"
            v-model="formInline.completeTime"
            type="date"
            value-format="YYYY-MM-DD"
            placeholder="选择实际完成时间"
          />
        </el-form-item>
        <el-form-item label="实际情况描述" class="oneline">
          <el-input
            :disabled="state.type>0 && state.type<2"
            v-model="formInline.description"
            show-word-limit
            type="textarea"
          />
        </el-form-item>
        <el-form-item label="是否存在问题">
          <el-radio-group v-model="formInline.isProblem" :disabled="state.type > 0 && state.type < 2">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="问题概述" class="oneline">
          <el-input
            :disabled="state.type > 0 && state.type < 2"
            v-model="formInline.problemDescription"
            show-word-limit
            type="textarea"
          />
        </el-form-item>
        <!-- 全部人员 -->
        <el-row>


        <el-col :span="24" v-if="state.type">
          <CommonTitle titleName="其他信息"></CommonTitle>
        </el-col>

        <el-col  v-if="state.type">
          <el-form-item label="申请人" class="oneline">
            <el-input disabled v-model="formInline.applyUserName" placeholder="" />
          </el-form-item>
        </el-col>

        <el-col  v-if="state.type">
          <el-form-item label="申请部门" class="oneline">
            <el-input
              disabled
              v-model="formInline.applyDepartmentName"
              placeholder=""
            />
          </el-form-item>
        </el-col>
        <el-col  v-if="state.type">
          <el-form-item label="创建时间" class="oneline">
            <el-input disabled v-model="formInline.createTime" placeholder="" />
          </el-form-item>
        </el-col>
      </el-row>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="state.centerDialogVisible = false" class="button_cancel2">取消</el-button>
          <el-button @click="submitHandler" v-if="state.type === 0" class="button_view">
            确认
          </el-button>
          <el-button @click="submitHandler" v-if="state.isDark==='1' && state.type === 2" class="button_view">
            修改
          </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import upload from '@/components/uploadCom/upload.vue'
import { ref, reactive } from 'vue'
import {
  ElDialog,
  ElForm,
  ElCol,
  ElRow,
  ElFormItem,
  ElMessage
} from 'element-plus'
// import FileUpload from '@/components/FileUpload.vue'
import FileMinioUpload from "@/components/FileMinioUpload.vue";
import { implementationResult } from '@/api/project'
import CommonTitle from '@/components/CommonTitle.vue'
let centerDialogVisible = ref(false)
const formInline = reactive({
  files: [],
  description: '',
  problemDescription: '',
  isProblem: 0,
  planStartTime: []
})
const state = reactive({
  projectTaskId: '',
  itemId: '',
  type: 0,
  businessId: '',
  centerDialogVisible: false,
  projectRow: {},
  isDark:'',
})
const rules = {
  files: [{ required: true, message: '文件不能为空', trigger: 'blur' }]
}
//弹框打开前的回调
const openHandler = () => {
  let obj = {
    projectTaskId: state.projectTaskId || '',
    businessId: state.businessId || '',
    itemId: state.itemId || ''
  }
  implementationResult.getInfo(obj).then((res) => {
    if (res.code === '200') {
      let obj = { ...res.data, ...res.data?.taskInfo }
      for (const key in obj) {
        formInline[key] = obj[key]===null?'':obj[key];
        if (key === 'files') {
          formInline[key] = obj[key] || []
        }
        if (key === 'planStartTime') {
            formInline['planTime'] = [res.data['planStartTime'], res.data['planEndTime']];
        }
        if (key === 'isProblem') {
          formInline[key] = 0
        }
      }
    }
  })
}
const emits = defineEmits(['refreshList'])
//弹框关闭
const handleClose = () => {
  for (const key in formInline) {
    formInline[key] = ''
  }
  emits('refreshList')
}

const formRef = ref(null)
//上报提交
const submitHandler = () => {
  formRef.value.validate((valid, fields) => {
    if (valid) {
        if(formInline.planTime==='' || (Array.isArray(Array) && formInline.planTime.length===0)){
            return ElMessage.warning('计划时间不能为空!');
        }
        let params = {
            files: formInline.files,
            projectTaskId: formInline.projectTaskId,
            isProblem: formInline.isProblem,
            description: formInline.description,
            completeTime: formInline.completeTime,
            itemId: state.itemId,
            problemDescription: formInline.problemDescription,
        }
        if(state.isDark==='1' && state.type===2){
            params.reportId = formInline.reportId;
        }
        if(formInline.planTime && Array.isArray(formInline.planTime)){
            params.planStartTime = formInline.planTime[0];
            params.planEndTime = formInline.planTime[1];
        }
        if(state.isDark==='1'){ // 暗线
            params.isDark = 1;
        }
        implementationResult
            .save(params)
            .then((res) => {
                if (res.code === '200') {
                    state.centerDialogVisible = false
                    ElMessage.success('操作成功')
                }
            })
    }
  })
}
defineExpose({
  state
})
</script>
<style lang="scss" scoped>
@import '@/assets/general_style/dialog.scss';
@import '@/views/constructionProjectManage/static/dialog.scss';
</style>
